<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=1024">
<title>CDCCAM | Service</title>
<link rel="shortcut icon" href="img/icon.png" type="image/x-icon">
<link href="css/font-awesome.css" rel="StyleSheet" type="text/css"/>
<link href="css/style.css" rel="StyleSheet" type="text/css"/>
<link href="css/745.css" rel="StyleSheet" type="text/css"/>
<script type="text/javascript" src="js/jquery.js" ></script>
<script type="text/javascript" src="js/jqueryui.js" ></script>
<script type="text/javascript" >
	$(document).ready(function(){
		function Slide(images){
			var img_label = ["name1","name2","name3","name4","name5","name6","name7","name8"];
			//$(".dcr-sld-namesp").append(name);
		
			var _slide = document.createElement("div");
			var _slide_pre = document.createElement("div");
			var _slide_thumbs = document.createElement("div");
			var _names = new Array();
			var _images = new Array();
			var _current_slide= 0 ;
			var _interval = null;
			
			_slide.addImage=function(image){_images.push(image);};
			
			$(_slide).attr("class","dcr-sld-h");
			$(_slide_pre).attr("class","dcr-sld-pre");
			$(_slide_thumbs).attr("class","dcr-sld-thumbs");
			
			$(_slide).append( _slide_pre ).append( _slide_thumbs );
			
			for(var i=0;i<images.length;i++){
				var thumb = document.createElement("div");
				var img = document.createElement("img");
				var names = document.createElement("div");
				$(names).attr("class","dcr-sld-namesp").text(img_label[i]);
				$(thumb).attr("class","dcr-sld-thumb").attr("sid",i).append(names).append(img).click(function(){
					_current_slide=parseInt($(this).attr("sid"));
					$(_slide_pre).find("img").toggle("slide",function(){
						$(this).attr("src",images[_current_slide]).toggle("slide")
					});
					clearInterval(_interval);
					_interval=setInterval(function(){animateSlide();},5000);
				});
				$(img).attr("src",images[i]);
				$(_slide_thumbs).append(thumb);
				if(i==0){
					var pre_i = document.createElement("div");
					var img = document.createElement("img");
					$(img).attr("src",images[i]).attr("class","img");
					$(pre_i).attr("class","dct-sld-i").append(img);
					$(_slide_pre).append(pre_i);
				}
			}
			
			function animateSlide(){
				_current_slide=_current_slide>=(images.length-1)?0:(_current_slide+1);
				$(_slide_pre).find("img").toggle("fadeout",function(){
					$(this).attr("src",images[_current_slide]).toggle("fadein")
				});
			}
			
			_slide.animate=function(){
				//_interval=setInterval(animateSlide(),1000);
				_interval=setInterval(function(){animateSlide();},5000);
			};
			_slide.stop=function(){clearInterval(_interval);};
			return _slide;
		}
		
		var images = ["img/sld1.jpg","img/sld2.jpg","img/sld3.jpg","img/sld4.jpg","img/sld5.jpg","img/sld6.jpg","img/sld7.jpg","img/sld8.jpg"];
		var slide = new Slide(images);
		$(".m-slide").append(slide);
		slide.animate();
		
	});
</script>
</head>
<body>
	<div class="dcr-lyr" >
		<!--<div class="lyr-fixed dcr-top" >
			<div class="dcr-phone" ><div class="fa fa-phone" style="padding: 0px 5px 0px 0px; font-size: 14px;"  ></div>855(0)12 97 8800488</div>
			<div class="dcr-email" ><div class="fa fa-envelope"  style="padding: 0px 5px 0px 0px;  font-size: 14px;" ></div>info@cdccam.com</div>
		</div>-->
        <div class="header">
		<div class="lyr-fixed dcr-lg-mnu" >
			<div class="dcr-logo" ><img src="img/logo.png" height="100%" style="display: inline-block;" /></div>
			<div class="dcr-mnu-src" >
				<div class="dcr-mnu" >
                    <div class="sc-fb fa fa-facebook-square" ></div>
                    <div class="sc-skp fa fa-skype" ></div>
                    <!--<div class="sc-yt fa fa-youtube-square" ></div>
                    <div class="sc-tw fa fa-twitter-square" ></div>
                    <div class="sc-gp fa fa-google-plus-square" ></div>-->
				</div>
				<div class="dcr-src" >
					<input type="text" name="txtsearch" id="txtsearch" class="txtsearch" placeholder="Search ... " value="" />
					<span class="search-icon fa fa-search" ></span>
				</div>
			</div>
		</div>
        </div>
        
    <div class="menus">
        <div class="dcr-mnus" >
					<div class="dcr-mnu-i" ><a href="index.html" >HOME</a></div>
					<div class="dcr-mnu-i" ><a href="about.html" >ABOUT US</a></div>
					<div class="dcr-mnu-i dcr-sub-mnu" >
						<a class="active" href="service.html" >SERVICE</a>
						<ul>
							<li><a href="wwd.html#service" >What we do</a></li>
							<li><a href="builtout.html#build-out" >BUILD-OUT</a></li>
							<li><a href="restoration.html#restoration" >Restoration</a></li>
							<li><a href="mfc.html#multi-family" >Multi-Family Construction</a></li>
							<li><a href="flats.html#flates" >Flats</a></li>
							<li><a href="townhouse.html#town-house" >Townhouses</a></li>
							<li><a href="duplex.html#duplex" >Duplex</a></li>	
						</ul>
					</div>
					<div class="dcr-mnu-i" ><a href="gallery.html" >GALLERY</a></div>
					<div class="dcr-mnu-i" ><a href="contact.html" >CONTACT</a></div>
        
        
   	</div>
    </div>
    
    
	<div class="dcr-lyr" style="background: #000; " >
		<div class="lyr-fixed m-slide" ></div>
	</div>
	<div class="dcr-lyr" >
		<div class="lyr-fixed dcr-mn-cntn" >
			<div class="dcr-ls" >
				<div class="blk-info" style="width: 99%; padding: 0px 0.5%; " >
					<a name="flates"></a>
					<!--  Flats -->
					<h3 style="font-family: 'SWISSB'; font-size: 15px; color: #CF4E9D; " >Flats</h3>
					<p>Flats are a lot like houses. Flats typically range from two to four floors. Each floor is an individual apartment. Each flat usually shares commons are with every other flat like front, entrances, outside stairs, basement or a foyer. Flats are a great choice if your looking to build and rent out multi-family housing in a residential neighborhood with a lot of homes since flat look like a house.</p>
				</div>
				<div class="blk-info" style="width: 99%; padding: 0px 0.5%; text-align: center;" >
					<img src="img/sld6.jpg" width="100%" />
				</div>
			</div>
			<div class="dcr-rs" style="border-left: 1px dashed #CCC; " >
				<h2 style="font-family: 'SWISSB'; font-size: 22px; margin: 2px 0px;" >Our products</h3>
				<ul>
					<li><a href="wwd.html#service">What we do</a></li>
					<li><a href="builtout.html#build-out">BUILD-OUT</a></li>
					<li><a href="restoration.html#restoration">Restoration</a></li>
					<li><a href="mfc.html#multi-family">Multi-Family Construction</a></li>
					<li><a href="flats.html#flates">Flats</a></li>
					<li><a href="townhouse.html#town-house">Townhouses</a></li>
					<li><a href="duplex.html#duplex">Duplex</a></li>
				</ul>
			</div>
		</div>
		<div class="lyr-fixed dcr-footer" >
			<div class="drc-addr-term" >
				<div class="dcr-address" >
				Chaktumok D&eacute;cor &amp; Construction (Cambodia) Limited<br/>
				<span style="color: #999; font-size: 12px; " >
				Building #5C, St. 284 corner St. 163, Olympic,Chomkamorn, Phnom Penh, Cambodia.<br/> 
				Tel:  855(0)23 000 000| 855(0)12 333 585 Email: info@cdccam.com
				</span>
				</div>
				<div class="dcr-term" ><a >Term of service</a> | <a >Privacy policy</a></div>
			</div>
			<div class="dcr-alr-mnu" >
				<div class="alr-dsn" >2014 All Rights researved. Designed By: ASDICT</div>
				<div class="alr-mnu" >
					<div class="alr-mnu-i" ><a href="contact.html" >Contact</a></div>
					<div class="alr-mnu-i" ><a href="gallery.html" >Gallery</a></div>
					<div class="alr-mnu-i" ><a href="service.html" class="active" >Service</a></div>
					<div class="alr-mnu-i" ><a href="about.html" >About</a></div>
					<div class="alr-mnu-i" ><a href="index.html" >Home</a></div>
				</div>
			</div>
		</div>
	</div>
</body>
</html>